<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="${ctxPath}/static/payCss/payconfirm.css" type="text/css" />
</head>
<body class="my">
    <div class="box_a">
        <div class="box_a_1">
            <div class="return1">
                <a class="rers" href="javascript:history.back();"> <div class="return " >返回</div></a>
            </div>
            <span class="box_a_1_s">请输入交易密码</span>
        </div>
        <p class="box_a_p1">订单总额：<span id="rental">${payVo.coins[0].echoAmount}  ${strutil.toUpperCase(payVo.coins[0].currency)}</span></p>
    </div>
    <div class="box_b">
        <div class="box_b_1"><input type="password" class="box_b_inp" placeholder="请输入交易密码" /></div>
        <p class="box_b_p" id="box_b_p">忘记密码？</p>
    </div>
    <div class="box_c">
        <button class="box_c_b">确定</button>
    </div>
    <script src="https://itjh.oss-cn-beijing.aliyuncs.com/static/jquery-3.3.1.min.js"></script>
    <script type="text/javascript"> 
            var wx5 = /x5app/.test(navigator.userAgent) && !window.MSStream;
            if(!wx5){
                $(".my").css("margin-top","0");
            };
        (function(designWidth, maxWidth) {
            var doc = document,
                win = window;
            var docEl = doc.documentElement;
            var metaEl,
                metaElCon;
            var styleText,
                remStyle = document.createElement("style");
            var tid;
            function refreshRem() {
                // var width = parseInt(window.screen.width); // uc有bug
                var width = docEl.getBoundingClientRect().width;
                if (!maxWidth) {
                    maxWidth = 540;
                };
                if (width > maxWidth) { // 淘宝做法：限制在540的屏幕下，这样100%就跟10rem不一样了
                    width = maxWidth;
                }
                var rem = width * 100 / designWidth;
                // var rem = width / 10; // 如果要兼容vw的话分成10份 淘宝做法
                //docEl.style.fontSize = rem + "px"; //旧的做法，在uc浏览器下面会有切换横竖屏时定义了font-size的标签不起作用的bug
                remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
            }
            // 设置 viewport ，有的话修改 没有的话设置
            metaEl = doc.querySelector('meta[name="viewport"]');
            // 20171219修改：增加 viewport-fit=cover ，用于适配iphoneX
            metaElCon = "width=device-width,initial-scale=1,maximum-scale=1.0,user-scalable=no,viewport-fit=cover";
            if(metaEl) {
                metaEl.setAttribute("content", metaElCon);
            }else{
                metaEl = doc.createElement("meta");
                metaEl.setAttribute("name", "viewport");
                metaEl.setAttribute("content", metaElCon);
                if (docEl.firstElementChild) {
                    docEl.firstElementChild.appendChild(metaEl);
                }else{
                    var wrap = doc.createElement("div");
                    wrap.appendChild(metaEl);
                    doc.write(wrap.innerHTML);
                    wrap = null;
                }
            }

            //要等 wiewport 设置好后才能执行 refreshRem，不然 refreshRem 会执行2次；
            refreshRem();

            if (docEl.firstElementChild) {
                docEl.firstElementChild.appendChild(remStyle);
            } else {
                var wrap = doc.createElement("div");
                wrap.appendChild(remStyle);
                doc.write(wrap.innerHTML);
                wrap = null;
            }
            win.addEventListener("resize", function() {
                clearTimeout(tid); //防止执行两次
                tid = setTimeout(refreshRem, 300);
            }, false);
            win.addEventListener("pageshow", function(e) {
                if (e.persisted) { // 浏览器后退的时候重新计算
                    clearTimeout(tid);
                    tid = setTimeout(refreshRem, 300);
                }
            }, false);
            if (doc.readyState === "complete") {
                doc.body.style.fontSize = "16px";
            } else {
                doc.addEventListener("DOMContentLoaded", function(e) {
                    doc.body.style.fontSize = "16px";
                }, false);
            }
        })(750, 750);
        $("#box_b_p").click(function () {
            var hrefs =window.location.href;
            $.ajax({
               // url:"https://gate.bibitrip.com/api/cp/common/version/get?client=H5&ran="+Math.random(),
               url:"https://ms.bibi321.com/api/cp/common/version/get?client=H5&ran="+Math.random(),
             success:function (data) {
                   if(data.data.version){
                       // location.href="https://m.bibi321.com/"+data.data.version+"/cardbox/forgetJyPassword.w?from="+hrefs;
                       location.href="https://${bibiUriPrefix}.bibi321.com/"+data.data.version+"/cardbox/forgetJyPassword.w?from="+hrefs;
                   }
             }
            });
        });
        $(".box_c_b").click(function () {
            var password =$(".box_b_inp").val();
            $.post("doPay",{payPassword:password}, function(data) {
                if(data.status==="0000"){
                    window.location.href="payDetail?a="+Math.random()*10;
                }else{
                    var msg="";
                    if(data.status==="0001"){
                        msg=data.data;
                    }
                    if(data.status==="0002"){
                        msg=data.data.msg;
                    }
                    if(data.status==="0003"){
                        msg=data.data;
                    }
                    if(data.status==="0004"){
                        msg=data.data;
                    }
                    // window.location.href="payError?msg="+msg;
                    $(".box_b_inp").val("");
                    alert_firm(msg);
                }
            });
        });
        function alert_firm(text){
            var  newElement = $('<div class="alert_firm" style="position:fixed;text-align:center;width:70%; left: 15%;background: rgba(0, 0, 0, 0.6); color: #fff; height: 1rem ;line-height:1rem;border-radius: .2rem; top: 45%;"> <span class="al_font" style="padding: .2rem;">'+text+'</span> </div>');
            $("body").append(newElement);
            setTimeout(function () {
                $(".alert_firm").fadeOut("slow");
                $(".alert_firm").fadeOut(1000);
                $(".alert_firm").remove();
            }, 1000)
        }
    </script>
</body>
</html>